<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="A fully featured admin theme which can be used to build CRM, CMS, etc.">
        <meta name="author" content="Coderthemes">

        <link rel="shortcut icon" href="assets/images/favicon_1.ico">

        <title>Ubold - Responsive Admin Dashboard Template</title>

        <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="assets/css/icons.css" rel="stylesheet" type="text/css" />
        <link href="assets/css/style.css" rel="stylesheet" type="text/css" />

        <script src="assets/js/modernizr.min.js"></script>


    </head>


    <body class="fixed-left" id="do-nicescrol">
        <!-- Page-Title -->
        <div class="row">
            <div class="col-sm-12">
                <div class="btn-group pull-right m-t-15">
                    <button type="button" class="btn btn-default dropdown-toggle waves-effect waves-light" data-toggle="dropdown" aria-expanded="false">Settings</button>
                    <div class="dropdown-menu dropdown-menu-right" aria-labelledby="btnGroupDrop1">
                        <a class="dropdown-item" href="ui-checkbox-radio.html#">Dropdown One</a>
                        <a class="dropdown-item" href="ui-checkbox-radio.html#">Dropdown Two</a>
                        <a class="dropdown-item" href="ui-checkbox-radio.html#">Dropdown Three</a>
                        <a class="dropdown-item" href="ui-checkbox-radio.html#">Dropdown Four</a>
                    </div>
                </div>

                <h4 class="page-title">单、复选框</h4>
                <p class="text-muted page-title-alt">欢迎来到Ubold管理面板 !</p>

            </div>
        </div>


        <!-- CHECKBOX -->

        <div class="row">
            <div class="col-md-12">
                <div class="">
                    <div class="card-box">
                        <div class="row">
                            <div class="col-lg-4 col-md-6">
                                <h4 class="m-t-0 header-title"><b>基本</b></h4>

                                <p class="text-muted font-13 m-b-30">
                                    S支持引导品牌颜色: <code>.checkbox-primary</code>, <code>.checkbox-info</code> etc等等.
                                </p>
                                <div class="checkbox">
                                    <input id="checkbox0" type="checkbox">
                                    <label for="checkbox0">
                                        Default
                                    </label>
                                </div>
                                <div class="checkbox checkbox-custom">
                                    <input id="checkbox11" type="checkbox" checked>
                                    <label for="checkbox11">
                                        Custom
                                    </label>
                                </div>
                                <div class="checkbox checkbox-primary">
                                    <input id="checkbox2" type="checkbox" checked>
                                    <label for="checkbox2">
                                        Primary
                                    </label>
                                </div>
                                <div class="checkbox checkbox-success">
                                    <input id="checkbox3" type="checkbox">
                                    <label for="checkbox3">
                                        Success
                                    </label>
                                </div>
                                <div class="checkbox checkbox-info">
                                    <input id="checkbox4" type="checkbox">
                                    <label for="checkbox4">
                                        Info
                                    </label>
                                </div>
                                <div class="checkbox checkbox-warning">
                                    <input id="checkbox5" type="checkbox" checked>
                                    <label for="checkbox5">
                                        Warning
                                    </label>
                                </div>
                                <div class="checkbox checkbox-danger">
                                    <input id="checkbox6" type="checkbox" checked>
                                    <label for="checkbox6">
                                        Danger
                                    </label>
                                </div>
                                <div class="checkbox checkbox-purple">
                                    <input id="checkbox6a" type="checkbox">
                                    <label for="checkbox6a">
                                        Purple
                                    </label>
                                </div>

                                <div class="checkbox checkbox-pink">
                                    <input id="checkbox6b" type="checkbox" checked>
                                    <label for="checkbox6b">
                                        Pink
                                    </label>
                                </div>

                                <div class="checkbox checkbox-inverse">
                                    <input id="checkbox6c" type="checkbox">
                                    <label for="checkbox6c">
                                        Inverse
                                    </label>
                                </div>



                                <p class="text-muted font-13 m-b-15 m-t-20"没有标签文本的复选框 <code>.checkbox-single</code></p>
                                <div class="checkbox checkbox-single">
                                    <input type="checkbox" id="singleCheckbox1" value="option1" aria-label="Single checkbox One">
                                    <label></label>
                                </div>
                                <div class="checkbox checkbox-primary checkbox-single">
                                    <input type="checkbox" id="singleCheckbox2" value="option2" checked aria-label="Single checkbox Two">
                                    <label></label>
                                </div>


                                <p class="text-muted font-13 m-b-15 m-t-20">内联复选框</p>
                                <div class="checkbox form-check-inline">
                                    <input type="checkbox" id="inlineCheckbox1" value="option1">
                                    <label for="inlineCheckbox1"> Inline One </label>
                                </div>
                                <div class="checkbox checkbox-success form-check-inline">
                                    <input type="checkbox" id="inlineCheckbox2" value="option1" checked>
                                    <label for="inlineCheckbox2"> Inline Two </label>
                                </div>
                                <div class="checkbox checkbox-pink form-check-inline">
                                    <input type="checkbox" id="inlineCheckbox3" value="option1">
                                    <label for="inlineCheckbox3"> Inline Three </label>
                                </div>
                            </div>


                            <div class="col-lg-4 col-md-6">
                                <h4 class="m-t-0 header-title"><b>盘旋</b></h4>

                                <p class="text-muted font-13 m-b-30">
                                    <code>.checkbox-circle</code> for roundness.
                                </p>
                                <div class="checkbox checkbox-circle">
                                    <input id="checkbox7" type="checkbox">
                                    <label for="checkbox7">
                                        Simply Rounded
                                    </label>
                                </div>
                                <div class="checkbox checkbox-custom checkbox-circle">
                                    <input id="checkbox71" type="checkbox" checked>
                                    <label for="checkbox71">
                                        Custom
                                    </label>
                                </div>
                                <div class="checkbox checkbox-info checkbox-circle">
                                    <input id="checkbox8" type="checkbox" checked>
                                    <label for="checkbox8">
                                        Info
                                    </label>
                                </div>
                                <div class="checkbox checkbox-primary checkbox-circle">
                                    <input id="checkbox-9" type="checkbox">
                                    <label for="checkbox-9">
                                        Primary
                                    </label>
                                </div>
                                <div class="checkbox checkbox-success checkbox-circle">
                                    <input id="checkbox-10" type="checkbox" checked>
                                    <label for="checkbox-10">
                                        Success
                                    </label>
                                </div>
                                <div class="checkbox checkbox-warning checkbox-circle">
                                    <input id="checkbox-11" type="checkbox">
                                    <label for="checkbox-11">
                                        Warning
                                    </label>
                                </div>
                                <div class="checkbox checkbox-danger checkbox-circle">
                                    <input id="checkbox-12" type="checkbox" checked>
                                    <label for="checkbox-12">
                                        Danger
                                    </label>
                                </div>

                                <div class="checkbox checkbox-purple checkbox-circle">
                                    <input id="checkbox-13" type="checkbox" checked>
                                    <label for="checkbox-13">
                                        Purple
                                    </label>
                                </div>

                                <div class="checkbox checkbox-pink checkbox-circle">
                                    <input id="checkbox-14" type="checkbox">
                                    <label for="checkbox-14">
                                        Pink
                                    </label>
                                </div>

                                <div class="checkbox checkbox-inverse checkbox-circle">
                                    <input id="checkbox-15" type="checkbox" checked>
                                    <label for="checkbox-15">
                                        Inverse
                                    </label>
                                </div>
                            </div>


                            <div class="col-lg-4 col-md-6">
                                <h4 class="m-t-0 header-title"><b>禁止选</b></h4>

                                <p class="text-muted font-13 m-b-30">
                                    Disabled state also supported.
                                </p>
                                <div class="checkbox">
                                    <input id="checkbox9" type="checkbox" disabled>
                                    <label for="checkbox9">
                                        Can't check this
                                    </label>
                                </div>
                                <div class="checkbox checkbox-custom">
                                    <input id="checkbox10" type="checkbox" disabled checked>
                                    <label for="checkbox10">
                                        This too
                                    </label>
                                </div>
                                <div class="checkbox checkbox-warning checkbox-circle">
                                    <input id="checkbox110" type="checkbox" disabled checked>
                                    <label for="checkbox110">
                                        And this
                                    </label>
                                </div>
                                <div class="checkbox checkbox-info">
                                    <input id="checkbox12" type="checkbox" disabled checked>
                                    <label for="checkbox12">
                                        Can't check this
                                    </label>
                                </div>
                                <div class="checkbox checkbox-pink">
                                    <input id="checkbox13" type="checkbox" disabled checked>
                                    <label for="checkbox13">
                                        This too
                                    </label>
                                </div>
                                <div class="checkbox checkbox-purple checkbox-circle">
                                    <input id="checkbox14" type="checkbox" disabled checked>
                                    <label for="checkbox14">
                                        And this
                                    </label>
                                </div>
                            </div>


                        </div>
                    </div>
                </div>
            </div>

        </div> <!-- end row -->


        <!-- RADIOS -->

        <div class="row">
            <div class="col-md-12">
                <div class="">
                    <div class="card-box">
                        <div class="row">
                            <div class="col-lg-4 col-md-6">
                                <h4 class="m-t-0 header-title"><b>基本</b></h4>

                                <p class="text-muted font-13 m-b-30">
                                    支持引导品牌颜色: <code>.radio-primary</code>, <code>.radio-danger</code> etc.
                                </p>
                                <div class="row">
                                    <div class="col-sm-6">
                                        <div class="radio">
                                            <input type="radio" name="radio" id="radio1" value="option1" checked>
                                            <label for="radio1">
                                                Default
                                            </label>
                                        </div>
                                        <div class="radio radio-custom">
                                            <input type="radio" name="radio" id="radio2" value="option2">
                                            <label for="radio2">
                                                Custom
                                            </label>
                                        </div>
                                        <div class="radio radio-primary">
                                            <input type="radio" name="radio" id="radio3" value="option3">
                                            <label for="radio3">
                                                Primary
                                            </label>
                                        </div>
                                        <div class="radio radio-success">
                                            <input type="radio" name="radio" id="radio4" value="option4">
                                            <label for="radio4">
                                                Success
                                            </label>
                                        </div>
                                        <div class="radio radio-info">
                                            <input type="radio" name="radio" id="radio5" value="option5">
                                            <label for="radio5">
                                                Info
                                            </label>
                                        </div>
                                        <div class="radio radio-danger">
                                            <input type="radio" name="radio" id="radio6" value="option6">
                                            <label for="radio6">
                                                Danger
                                            </label>
                                        </div>
                                        <div class="radio radio-warning">
                                            <input type="radio" name="radio" id="radio7" value="option7">
                                            <label for="radio7">
                                                Warning
                                            </label>
                                        </div>
                                        <div class="radio radio-purple">
                                            <input type="radio" name="radio" id="radio8" value="option8">
                                            <label for="radio8">
                                                Purple
                                            </label>
                                        </div>
                                        <div class="radio radio-pink">
                                            <input type="radio" name="radio" id="radio9" value="option9">
                                            <label for="radio9">
                                                Pink
                                            </label>
                                        </div>

                                    </div>

                                    <div class="col-sm-6">
                                        <div class="radio">
                                            <input type="radio" name="radio1" id="radio11" value="option1" checked>
                                            <label for="radio11">
                                                Default
                                            </label>
                                        </div>
                                        <div class="radio radio-custom">
                                            <input type="radio" name="radio2" id="radio12" value="option2">
                                            <label for="radio12">
                                                Custom
                                            </label>
                                        </div>
                                        <div class="radio radio-primary">
                                            <input type="radio" name="radio3" id="radio13" value="option3">
                                            <label for="radio13">
                                                Primary
                                            </label>
                                        </div>
                                        <div class="radio radio-success">
                                            <input type="radio" name="radio4" id="radio14" value="option4" checked>
                                            <label for="radio14">
                                                Success
                                            </label>
                                        </div>
                                        <div class="radio radio-info">
                                            <input type="radio" name="radio5" id="radio15" value="option5" checked>
                                            <label for="radio15">
                                                Info
                                            </label>
                                        </div>
                                        <div class="radio radio-danger">
                                            <input type="radio" name="radio6" id="radio16" value="option6">
                                            <label for="radio16">
                                                Danger
                                            </label>
                                        </div>
                                        <div class="radio radio-warning">
                                            <input type="radio" name="radio7" id="radio17" value="option7" checked>
                                            <label for="radio17">
                                                Warning
                                            </label>
                                        </div>
                                        <div class="radio radio-purple">
                                            <input type="radio" name="radio8" id="radio18" value="option8">
                                            <label for="radio18">
                                                Purple
                                            </label>
                                        </div>
                                        <div class="radio radio-pink">
                                            <input type="radio" name="radio9" id="radio19" value="option9" checked>
                                            <label for="radio19">
                                                Pink
                                            </label>
                                        </div>

                                    </div>

                                </div>


                                <p class="text-muted font-13 m-b-15 m-t-20">没有标签文本的单选框 <code>.radio-single</code></p>
                                <div class="radio radio-single">
                                    <input type="radio" id="singleRadio1" value="option1.1" name="radioSingle1" aria-label="Single radio One">
                                    <label></label>
                                </div>
                                <div class="radio radio-success radio-single">
                                    <input type="radio" id="singleRadio2" value="option2.1" name="radioSingle1" checked aria-label="Single radio Two">
                                    <label></label>
                                </div>


                                <p class="text-muted font-13 m-b-15 m-t-20">内联单选框</p>
                                <div class="radio radio-info form-check-inline">
                                    <input type="radio" id="inlineRadio1" value="option1" name="radioInline" checked>
                                    <label for="inlineRadio1"> Inline One </label>
                                </div>
                                <div class="radio form-check-inline">
                                    <input type="radio" id="inlineRadio2" value="option2" name="radioInline">
                                    <label for="inlineRadio2"> Inline Two </label>
                                </div>
                            </div>


                            <div class="col-lg-4 col-md-6">
                                <h4 class="m-t-0 header-title"><b>Disabled</b></h4>

                                <p class="text-muted font-13 m-b-30">
                                    Disabled state also supported.
                                </p>
                                <div class="radio radio-danger">
                                    <input type="radio" name="radio31" id="radio51" value="option1" checked disabled>
                                    <label for="radio51">
                                        Next
                                    </label>
                                </div>
                                <div class="radio">
                                    <input type="radio" name="radio41" id="radio61" value="option2" checked disabled>
                                    <label for="radio61">
                                        One
                                    </label>
                                </div>
                                <div class="radio radio-custom">
                                    <input type="radio" name="radio51" id="radio71" value="option3" checked disabled>
                                    <label for="radio71">
                                        Next
                                    </label>
                                </div>
                                <div class="radio radio-pink">
                                    <input type="radio" name="radio61" id="radio81" value="option4" checked disabled>
                                    <label for="radio81">
                                        One
                                    </label>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div><!-- end row -->
                
        <script>
            var resizefunc = [];
        </script>

        <!-- jQuery  -->
        <script src="assets/js/jquery.min.js"></script>
        <script src="assets/js/popper.min.js"></script><!-- Popper for Bootstrap -->
        <script src="assets/js/bootstrap.min.js"></script>
        <script src="assets/js/detect.js"></script>
        <script src="assets/js/fastclick.js"></script>
        <script src="assets/js/jquery.slimscroll.js"></script>
        <script src="assets/js/jquery.blockUI.js"></script>
        <script src="assets/js/waves.js"></script>
        <script src="assets/js/wow.min.js"></script>
        <script src="assets/js/jquery.nicescroll.js"></script>
        <script src="assets/js/jquery.scrollTo.min.js"></script>

        <script src="assets/js/jquery.core.js"></script>
        <script src="assets/js/jquery.app.js"></script>

    </body>
</html>